<!--  -->
<template>
  <div class="container">
    <navbar
      class="de-navbar"
      :vaniconL="true"
      :noRight="true"
      :noLeft="false"
      :vaniconR="true"
      iconNameL="arrow-left"
      iconNameR="setting-o"
      :bgcolor="
        $route.params.platform == 1 ? 'rgb(55, 81, 255) !important' : ''
      "
      :bgImage="
        $route.params.platform == 1
          ? 'linear-gradient(rgb(55, 81, 255) 0%, rgb(76, 99, 255) 50%, rgb(91 112 255) 75%, rgb(107 127 255) 100%) !important'
          : ''
      "
      @clickLeft="goBack"
      >演示案例</navbar
    >
    <div style="height: 0.45rem"></div>
    <!-- <van-divider class="line"
      >(下拉刷新，建议在WIFI环境下调阅以节省流量)</van-divider
    > -->
    <div class="list">
      <div class="child" v-for="(item, index) in caseList" :key="index">
        <div class="left">
          <p class="num">{{ index + 1 }}</p>
          <van-image
            width="0.25rem"
            :src="require('../../assets/images/ysal.png')"
          ></van-image>
          <div class="date" @click="toDetails(item)">
            <p>
              案例部位：
              <span>{{ item.theme }}</span>
            </p>
            <!-- <p v-if="item && item.userName != '演示案例'">
              {{ $t("detailList.upload_date") }}:
              <span style="margin-left: 0.12rem">{{
                item ? item.creatTime : "--/--"
              }}</span>
            </p> -->
            <p>
              案例名称：
              <span>{{
                item.lungClassId == 0
                  ? "肺结节"
                  : item.lungClassId == 1
                  ? "新冠肺炎"
                  : "手机拍照"
              }}</span>
              <!-- <span
                >{{
                  item && item.uploadRoutea == 1 ? "手机拍照" : ""
                }}&nbsp;</span
              >
              <span
                >{{
                  item && item.uploadRouteb == 1 ? "电子胶片" : ""
                }}&nbsp;</span
              >
              <span>{{
                item && item.uploadRoutec == 1 ? "dicom格式" : ""
              }}</span> -->
            </p>
          </div>
        </div>
        <div class="btn-group">
          <van-button
            plain
            @click.stop="toDetails(item)"
            type="info"
            color="#4775d9"
            size="small"
            >影像详情</van-button
          >
          <van-button
            plain
            type="warning"
            size="small"
            v-if="item.lungClassId != 2"
            @click.stop="toReport(item)"
            >查看报告</van-button
          >
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import navbar from "@/components/navbar";
import { Toast, Dialog } from "vant";
import { mapGetters } from "vuex";
import { uploadGetShowcase, getCase } from "@/api/doctor";
export default {
  name: "demoList",
  data() {
    return {
      userDatas: null,
      caseList: [],
    };
  },

  components: { navbar },

  computed: {
    ...mapGetters(["userData"]),
  },

  created() {
    this.userDatas = JSON.parse(this.userData);
    this.getList();
  },
  mounted() {},

  methods: {
    // 返回上一页
    goBack() {
      // this.$store.commit("list/CLEAR_ID")
      // this.$router.replace({ path: "/readList" });
      if (this.$route.params.platform == 0) {
        this.$router.replace({ path: "/readList" });
      } else {
        this.$router.replace({ path: "/dindex" });
      }
    },
    // 获取列表
    getList() {
      const toast = Toast.loading({
        duration: 0, // 持续展示 toast
        forbidClick: true,
        message: "加载中",
      });
      // let data = {
      //   name: this.userDatas.userName,
      // };
      getCase().then((res) => {
        if (res.status.code == 200) {
          this.caseList = res.data.info;
          Toast.clear();
        } else {
          Toast.fail(res.data.msg);
        }
      });
    },
    // 跳转详情
    toDetails(item) {
      this.$router.push({
        name: "demoImg",
        params: {
          dsid: item.dsId,
          lungClassId: item.lungClassId,
          platform: this.$route.params.platform,
        },
      });
    },
    // 报告
    toReport(item) {
      if (item.lungClassId == "0") {
        this.$router.push({
          name: "lungReport",
          params: {
            patientId: item.patientId,
            dsId: item.dsId,
            platform: this.$route.params.platform,
          },
        });
      } else if (item.lungClassId == "1") {
        this.$router.push({
          name: "reportDetail",
          params: {
            patientId: item.patientId,
            dsId: item.dsId,
            platform: this.$route.params.platform,
          },
        });
      }
    },
  },
};
</script>
<style lang='scss' scoped>
@import "../../assets/css/utils";
.container {
  position: relative;
  height: 100%;
  background: #f5f5f5;
  & .list {
    width: 94%;
    margin: 0 auto;
    margin-top: 0.2rem;
    padding-bottom: 0.45rem;
    & .child {
      position: relative;
      background: #ffffff;
      padding: 0.15rem 0.15rem;
      border-radius: 8px;
      box-shadow: 4px 4px 10px #cccccc;
      margin-bottom: 15px;
      & .left {
        display: flex;
        align-items: center;
        // margin-left: 0.1rem;
        & .num {
          font-size: 14px;
          color: #4973d7;
          margin-right: 0.1rem;
        }
        & .date {
          text-align: left;
          margin-left: 0.15rem;
          & p {
            font-size: 0.14rem;
            color: #999898;
            line-height: 0.2rem;
            margin: 10px 0;
          }
          & span {
            font-size: 0.14rem;
            color: black;
          }
        }
      }
      & .van-button {
        margin: 0 0.05rem;
      }
    }
  }
}
.btn-group {
  // position: absolute;
  text-align: right;
  display: inline-block;
  // right: 0.15rem;
  // bottom: 0.05rem;
  width: 100%;
  padding-top: 0.1rem;
  border-top: 1px solid #eaeaea;
}
</style>